<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>

        // 1. 使用 try...catch 解决报错的问题
        // 核心： 解决报错之后的阻塞

        // const num = 10;

        // 传统写法会阻塞代码的执行
        // num = 20;

        // 1.1 使用 try...catch 的语法
        try {
            // 要执行的语句
            num = 20;
        } catch (error) {
            // 捕获了错误之后执行的语句
            // 自动接收形参，是捕获到的错误类型和错误内容！
            console.log(error);
        }

        // console.log('最后要执行的代码！', num);


        // 2. 一些失误的封装
        function getData() {
            const num = Math.floor(Math.random() * 30 + 3);

            if (num % 2 === 0) {
                console.log('是偶数，可以做处理。');
            } else {
                throw new RangeError('不能给奇数啊兄嘚!')
                // throw 'hahaha';
            }
        }

        // 2.1 try...catch 捕获错误
        try {
            getData();
        } catch (err) {
            // 这些错误提示，可以使用一些弹窗组件完成
            console.log(err.message); // 错误提示的文本
            console.log(err.stack);
            console.log(err.name);
        }

        console.log('哈哈哈，今天天气真不错。');

    </script>
</body>

</html>